<template>
  <div
    style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px"
  >
    <h2 style="font-size: 18px; font-weight: 600; color: #333">热门课程推荐</h2>
    <div style="display: flex; gap: 8px">
      <button
        style="
          padding: 6px 14px;
          border: 2px solid #007bff;
          color: #007bff;
          border-radius: 20px;
          font-size: 14px;
          background: white;
          cursor: pointer;
        "
      >
        全部科目
      </button>
      <button
        style="
          padding: 6px 14px;
          border: 1px solid #e9ecef;
          color: #6c757d;
          border-radius: 20px;
          font-size: 14px;
          background: #f8f9fa;
          cursor: pointer;
        "
      >
        科目一
      </button>
      <button
        style="
          padding: 6px 14px;
          border: 1px solid #e9ecef;
          color: #6c757d;
          border-radius: 20px;
          font-size: 14px;
          background: #f8f9fa;
          cursor: pointer;
        "
      >
        科目二
      </button>
    </div>
  </div>
</template>

<script setup></script>
